/**
 * @description 邀好友
 */
import style from './styles/Invite.less';
import classnames from "classnames";
import React, { Component } from 'react';
import { Toast } from 'wd-mobile';
import { inviteRecommendGoods } from 'api_liuhaojie/app/goods';
import wxShare from "commons/wxShare";
import ShareOrPayLayer from "components/ShareOrPayLayer";
//img

class Invite extends React.Component {
    constructor() {
        super();
        this.state = {
            shopList: [],
            showShareOrPayLayer: false
        };
    }

    componentDidMount() {
        inviteRecommendGoods().then(data => {
            this.setState({
                shopList: data.data || []
            })
        })
    }

    render() {
        const { shopList } = this.state;
        return (<div className={style.Invite}>
            <div className={style.shopList}>
                {
                    shopList.length ? shopList.map((item, index) => {
                        return <div key={index} className={style.shopItem} onClick={() => {
                            location.href = `./goods.html#/Detail/${item.id}`;
                        }}>
                            <div className={style.img}>
                                <img src={item.goodsIcon} alt="" />
                            </div>
                            <div className={style.info}>
                                <div className={style.title}>{item.skuName}</div>
                                <div className={classnames(style.priceInfo, style.clearfix)}>
                                    <div className={style.moeny}>
                                        <div className={style.subTitle} style={{ visibility: item.isNoob == 1 ? "visible" : "hidden" }}>首单价</div>
                                        <div className={style.price}>￥{item.price} <span>￥{item.recommendPrice}</span></div>
                                    </div>
                                    <div className={style.recommend}>
                                        <div className={style.sellNum}>已售{item.soldNum}件</div>
                                        <div className={style.btn} onClick={(e) => {
                                            e.stopPropagation();
                                            this.setState({
                                                showShareOrPayLayer: true
                                            }, () => {
                                                let shareData = {};
                                                let pathNameArr = location.pathname.split("/");
                                                pathNameArr.pop();
                                                shareData.link = location.origin + pathNameArr.join("/") + "/goods.html" + `#/Detail/${item.id}`;
                                                shareData.title = `在吗？给你推荐${item.skuName}`;
                                                shareData.desc = `${item.skuName}已售${item.soldNum}件，库存不多，悄悄分享给你`;
                                                shareData.imgUrl = item.goodsIcon;
                                                wxShare(shareData);
                                            })

                                        }}>推荐给好友</div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    }) : ''
                }
            </div>
            <div className={style.bottomLogo}></div>
            <ShareOrPayLayer show={this.state.showShareOrPayLayer} onClick={() => {
                this.setState({
                    showShareOrPayLayer: false
                })
            }} />
        </div>
        );
    }
}

export default Invite;